<template>
  <div class="container">
    <div class="containerbox">
    <nav class="nav" @mouseleave="showOwner = false">
      <div class="navbox">
        <div class="logo_box">
          <p class="logo_img" @click="gohome"></p>
        </div>
        <div class="tell_box">
          <!-- <div class="search_box" v-if="showsearch == 1">
            <el-input placeholder="上海" prefix-icon="el-icon-search" v-model="search_hourse"></el-input>
          </div>   -->
          <i class="iconfont icon-dianhua" style="color:#FFDB00;font-size:33px;margin-top:5px;"></i>
          <span class="phone_number">4008822692</span>
        </div>
        <div class="nav_box">
          <ul class="class_list">
            <li v-for="(item,index) in Menulist" :key="index">
              <span @click="gotowant(item,index)" :class="{'active':$root.goIndex === index}" style="cursor:pointer" @mouseover="showTag(index)" @mouseleave="hideTag(index)">{{item.title}}
              </span>
            </li>
            <li>
              <span @click="moveToyz">投放房源</span>
            </li>
            <p v-if="showOwner" class="tag">直联业主,0佣交易</p>	
            <div style="clear:both;"></div>
          </ul>
        </div>
        <div class="user_box">
          <el-dropdown placement="bottom-start"  v-if="loginstatus=='true'">
              <div @click="moveToUnder">
                <img :src='faceUrl' alt="" class="user_img">
              </div>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item  @click.native="logout">
                  <i class="iconfont icon-exit"></i>退出登录
                </el-dropdown-item>
              </el-dropdown-menu>
          </el-dropdown>
          <span @click="login" class="login" v-else>登录 </span>
        </div>
      </div>
    </nav>

    <!-- 账户密码登录 -->
    <el-dialog :visible.sync="$root.dialogLogin" width="670px" :modal-append-to-body="false">
      <div class="loginModal">
        <p class="loginTit">欢迎登录房大办公</p>
        <p class="text-left">
          还没有注册？
          <span class="registerText" @click="register">注册</span>
        </p>
        <el-form :model="loginRuleForm" :rules="loginRules" ref="loginRuleForm" class="demo-ruleForm">
          <el-form-item prop="mobile">
            <div>
              <el-select v-model="phoneType" class="phoneType"> 
                <el-option v-for="(item,index) in options" :key="index" :label="item.zh_name" :value="item.prefix_code"></el-option>
              </el-select>
              <el-input type="text" v-model="loginRuleForm.mobile" autocomplete="off" class="phoneNum" placeholder="请输入手机号" autofocus :maxlength="11" clearable></el-input>
            </div>
          </el-form-item>
          <el-form-item prop="pass">
            <el-input type="password" v-model="loginRuleForm.pwdCode" show-password autocomplete="off" placeholder="请输入密码" clearable @keyup.enter.native="submitForm('loginRuleForm')"></el-input>
          </el-form-item>
          <p class="checkLogin text-right">
            <span @click="loginByCode">手机动态密码登录</span>&nbsp;&nbsp;|&nbsp;&nbsp;
            <span @click="foregest">忘记密码</span>
          </p>
          <el-form-item>
            <el-button type="primary" @click="submitForm('loginRuleForm')" class="loginBtn">登录</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>

	<!-- 验证码登录 -->
	<el-dialog :visible.sync="showloginCode" width="670px" :modal-append-to-body="false">
      <div class="loginModal">
        <p class="loginTit">欢迎登录房大办公</p>
        <p class="text-left">
          还没有注册？
          <span class="registerText" @click="register">注册</span>
        </p>
        <el-form :model="loginByCodeForm" status-icon ref="loginByCodeForm" class="demo-ruleForm">
          <el-form-item prop="mobile">
            <div>
              <el-select v-model="phoneType" class="phoneType">
                 <el-option v-for="(item,index) in options" :key="index" :label="item.zh_name" :value="item.prefix_code"></el-option>
              </el-select>
              <el-input type="text" v-model="loginByCodeForm.mobile" autocomplete="off" class="phoneNum" placeholder="请输入手机号" :maxlength="11"></el-input>
            </div>
          </el-form-item>
          <el-form-item prop="pwdCode">
            <el-row>
              <el-col :span="18">
                <el-input v-model="loginByCodeForm.pwdCode" placeholder="请输入验证码" @blur="checksmscodebycode" clearable @keyup.enter.native="LoginByPhoneCode('loginByCodeForm')"></el-input>
              </el-col>
              <el-col :span="6">
                <el-button icon="el-icon-mobile-phone" @click="send(3)" type="default" :disabled="disabled=!show">
                  <span v-show="show" style="font-size:13px;">获取验证码</span>
                  <span v-show="!show" class="count">{{count}} s</span>
                </el-button>
              </el-col>
            </el-row>
          </el-form-item>
          <p class="checkLogin text-right">
            <span @click="loginByPwd">普通密码登录</span>
          </p>
          <el-form-item>
            <el-button type="primary" @click="LoginByPhoneCode('loginByCodeForm')" class="loginBtn">登录</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>

    <!-- 注册 -->
    <el-dialog :visible.sync="registerModal" width="670px" :modal-append-to-body="false">
      <div class="registerModal">
        <p class="registerTit">欢迎登录房大办公</p>
        <p class="text-left">
          已有账号？
          <span class="registerText" @click="registertologin">登录</span>
        </p>
        <el-form :model="registerRuleForm" status-icon :rules="registerRules" ref="registerRuleForm" class="demo-ruleForm">
          <el-form-item prop="type">
            <el-radio-group v-model="registerRuleForm.type">
              <el-row>
                <el-col :span="6" :pull="14">
                  <el-radio-button label="0" size="medium" :style="radioStyle">我是用户</el-radio-button>
                </el-col>
                <!-- <el-col :span="6" :push="8">
                  <el-radio-button label="1" size="medium" :style="radioStyle">我是业主</el-radio-button>
                </el-col> -->
              </el-row>
            </el-radio-group>
          </el-form-item>
          <el-form-item>
            <div>
              <el-select v-model="prefix" class="phoneType">
                <el-option v-for="(item,index) in options" :key="index" :label="item.zh_name" :value="item.prefix_code"></el-option>
              </el-select>
              <el-input type="text" v-model="loginByCodeForm.mobile" autocomplete="off" class="phoneNum" placeholder="请输入手机号" clearable autofocus :maxlength="11"></el-input>
            </div>
          </el-form-item>
          <el-form-item prop="code">
            <el-row>
              <el-col :span="18">
                <el-input v-model="registerRuleForm.code" placeholder="请输入验证码" @blur="checkCode" clearable></el-input>
              </el-col>
              <el-col :span="6">
                <el-button icon="el-icon-mobile-phone" @click="send(1)" type="default" :disabled="disabled=!show">
                  <span v-show="show" style="font-size:13px;">获取验证码</span>
                  <span v-show="!show" class="count">{{count}} s</span>
                </el-button>
              </el-col>
            </el-row>
          </el-form-item>
          <el-form-item prop="password">
            <el-input type="password" v-model="registerRuleForm.password" autocomplete="off" placeholder="请输入密码，密码长度为20位" clearable></el-input>
          </el-form-item>
          <el-form-item prop="password">
            <el-input type="password" v-model="registerRuleForm.new_password" autocomplete="off" placeholder="请再次输入密码" clearable @keyup.enter.native="registerForm"></el-input>
          </el-form-item>
          <el-form-item>
            <el-row>
              <el-col :span="3">
                <div class="grid-content bg-purple invitation">邀请码</div>
              </el-col>
              <el-col :span="10" :offset="3"> 
                <el-input type="text" v-model="registerRuleForm.invitationCode" autocomplete="off" class="phoneNum" clearable placeholder="选填"></el-input>
              </el-col>
            </el-row>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="registerForm" class="loginBtn">注册</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>

    <!-- 找回密码 -->
    <el-dialog :visible.sync="showfindmodal1" width="670px" :modal-append-to-body="false">
      <div class="loginModal">
        <p class="loginTit">找回密码</p>
        <p class="text-left">
          已有账号？
          <span class="registerText" @click="login">登录</span>
        </p>
        <el-form :model="findRuleForm" status-icon  ref="findRuleForm" class="demo-ruleForm">
          <el-form-item prop="phone">
            <div>
              <el-select v-model="prefix" class="phoneType">
                 <el-option v-for="(item,index) in options" :key="index" :label="item.zh_name" :value="item.prefix_code"></el-option>
              </el-select>
              <el-input type="text" v-model="loginByCodeForm.mobile" autocomplete="off" class="phoneNum" clearable placeholder="请输入手机号" :maxlength="11"></el-input>
            </div>
          </el-form-item>
          <el-form-item prop="code">
            <el-row>
              <el-col :span="18">
                <el-input v-model="findRuleForm.code" placeholder="请输入验证码" clearable @blur="checkpwdCode"></el-input>
              </el-col>
              <el-col :span="6">
                <el-button icon="el-icon-mobile-phone" @click="send(6)" type="default" :disabled="disabled=!show">
                  <span v-show="show" style="font-size:13px;">获取验证码</span>
                  <span v-show="!show" class="count">{{count}} s</span>
                </el-button>
              </el-col>
            </el-row>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="nextSteep" class="loginBtn" :disabled="shownext">下一步</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>
    <!-- 跳转yz -->
    <el-dialog  :visible.sync="dialogContacts" width="639px"  :modal-append-to-body="false" center >
        <div style="text-align:center;font-size:20px;">该账号是业主账号，是否前往业主端</div>
        <div slot="footer"> 
            <button @click="dialogContacts=false" style="width:200px;height:40px;font-size:20px;border:0;background:rgba(255,227,0,1);letter-spacing:1px;margin-right:10px">取消</button>
            <button @click="moveToyz" style="width:200px;height:40px;font-size:20px;border:0;background:rgba(255,227,0,1);letter-spacing:1px;">确定</button>
        </div>
    </el-dialog>
    <!-- 重置密码 -->
    <el-dialog :visible.sync="showfindmodal2" width="670px" :modal-append-to-body="false">
      <div class="loginModal">
        <p class="loginTit">重置密码</p>
        <p class="text-left">
          已有账号？
          <span class="registerText" @click="login">登录</span>
        </p>
        <el-form :model="resetRuleForm" status-icon :rules="resetRules" ref="resetRuleForm" class="demo-ruleForm">
          <el-form-item prop="password" v-if="visible">
            <el-input type="password" v-model="resetRuleForm.password" show-password autocomplete="off" clearable placeholder="请输入密码，密码长度为6-20位"></el-input>
          </el-form-item>
          <el-form-item prop="new_password">
            <el-input type="password" v-model="resetRuleForm.new_password" show-password autocomplete="off" clearable placeholder="请再次输入密码"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="overSteep()" class="loginBtn">完成</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>
    </div>
  </div>
</template>

<script>
import { mapState, mapMutations, mapActions } from "vuex";
import { mobileLogin, resetPwd, getUserinfo, getUsers,setCookie,removeCookie,getCookie } from '@/api/login';
import { getRegister, getprefixcode, getsmscode, getchecksmscode } from "@/api/homepage";
import { getCitylist } from "@/api/office";
import { loadJS } from "@/api/common";

const TIME_COUNT = 60; //更改倒计时时间
const loginstatus = getCookie('islogin');
export default {
  metaInfo: {
    title: "首页",
    meta: [
      {
        name: "keywords",
        content: "办公,租赁,"
      },
      {
        name: "description",
        content: "导航"
      }
    ]
  },
  name: "Nav",
  data() {
      var validatePass2 = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入密码'));
      } else if (value !== this.resetRuleForm.password) {
        callback(new Error('两次输入密码不一致!'));
        return;
      } else {
        callback();
      }
    };
    return {
      showOwner:false,
      dialogContacts:false,
      active_index:0,
      sunzhengdata:{},
      faceUrlIndex:0,
      loginstatus:loginstatus,
      tokens:{
        token:'',
      },
      usertype:'',
      visible: true,  // 密码显示/隐藏
      hidepassword:true,
      // 获取验证码
      show: true, // 初始启用按钮
      count: "", // 初始化次数
      timer: null,
      // 导航
      showsearch: 0,
      show: true,
      
      showloginCode:false,
      registerModal: false,
      showfindmodal1: false,
      showfindmodal2: false,
      Menulist:[
        { title:"首页",link:"/home/homepage"},
        { title:"找办公空间",link:"/home/office/5"},
        { title:"租赁指南",link:"/home/business/officespace?typeid=1"},
        { title:"关于我们",link:"/home/about"},
        // { title:"业主",link:"/home/owner"},
      ],
      search_hourse: "",
      loginRuleForm: {  // 手机号登录
        mobile:"",
        pwdCode:"",
        type:"1"
	    },

      // 验证码登录
      loginByCodeForm: {  
        type: "2",
        pwdCode:'',
        mobile:'',
      },

      loginRules: {
        mobile: [{ required: true, message: "请输入手机号码", trigger: "blur" }],
        pwdCode: [{ required: true, message: "请输入验证码", trigger: "blur" }],
      },

      shownext:true,
      prefix: '+86',
      mobile: '',
      // 注册
      registerRuleForm: {
        type: 0,
		    password: "",
		    new_password:'',
        invitationCode: ""
      },
      findRuleForm: {
        code: ""
      },

      // 重置密码
      resetRuleForm: {
        password: "",
        new_password: "",
      },
      resetRules: {
        password: [{ required: true, message: "请输入密码", trigger: "blur" }],
        new_password:[{ validator: validatePass2, trigger: 'blur' }]
      },
	  
      loginByCodeRules: {
        mobile: [
          { required: true, message: "请输入手机号码", trigger: "blur" }
        ],
        pwdCode: [{ required: true, message: "请输入验证码", trigger: "blur" }],
      },
	  
      registerRules: {
        mobile: [{ required: true, message: "请输入电话号码", tger: "blur" }],
        password: [{ required: true, message: "请输入密码", trigger: "blur" }],
        new_password: [
          { required: true, message: "请再次输入密码", trigger: "blur" }
        ],
        invitationCode: [
          { required: false, message: "请输入邀请码", trigger: "blur" }
        ]
      },
      findRuleFormrRules: {
        phone: [{ required: true, message: "请输入电话号码", trigger: "blur" }],
        code: [{ required: true, message: "请输入验证码", trigger: "blur" }]
      },
      
      phoneType: "+86",
      options: [],
      passInput: true,
      active: "",
      active1: "",
      userhover: false,
      userhover1: false,
    };
  },


  methods: {
	...mapMutations(['FETCH_TOKEN','GET_USERNAME','GET_USERPIC','USER_TYPE']),
	...mapActions(['loginByCode','loginByAccount','fetchUserInfo','logOut']),

	loginByCode(){    // 切换验证码登录
		
    this.$root.dialogLogin = false;
    this.showloginCode = true;
    this.loginByCodeForm.mobile=this.loginRuleForm.mobile
    
  },
  setIndex(){
    if(window.localStorage.active_index==1){
      this.$root.active_index=1
    }
  },
  gotowant(item,index){
    window.localStorage.setItem("lowArea", 0);
    window.localStorage.setItem("highArea", 0);
    window.localStorage.setItem("type", 1);
    window.localStorage.setItem("city", window.sessionStorage.getItem('city'));
    window.localStorage.setItem('cityId','');
    window.localStorage.setItem('pageNum',1);
    window.localStorage.setItem('positionId',0);
    window.localStorage.setItem('positionType',0);
    window.localStorage.setItem('lowPrice',0);
    window.localStorage.setItem('highPrice',0);
    window.localStorage.setItem('lowPerson',0);
    window.localStorage.setItem('highPerson',0);
    window.localStorage.setItem('keyword','');
    this.$router.push({path: item.link}); 
  },
  showTag(index){
    if(index == 1){
      this.showOwner = true;
    }else{
      this.showOwner = false;
    }
  },
  hideTag(index){
     if(index == 1){
      this.showOwner = true;
      var tag = document.getElementsByClassName('tag');
    }else{
      this.showOwner = false;
    }
  },
	loginByPwd(){
		this.$root.dialogLogin = true;
    this.showloginCode = false;
    this.loginRuleForm.mobile=this.loginByCodeForm.mobile
	},
  
    showmarks() {},
    mouseOver() {
      this.userhover = true;
    },
    mouseLeave() {
      this.userhover = false;
    },
    mousedown() {
      this.active = "border: 1px solid #FFE300";
      this.active1 = "";
    },
    mouseOver1() {
      this.userhover1 = true;
    },
    mouseLeave1() {
      this.userhover1 = false;
    },
    mousedown1() {
      this.active1 = "border: 1px solid #FFE300";
      this.active = "";
    },
    login() {
      this.$root.dialogLogin = true;
      this.showfindmodal1 = false;
    },
    register() {
      this.showfindmodal1 = false;
      this.$root.dialogLogin = false;
      this.showfindmodal2 = false;
      this.registerModal = true;
    },

    registertologin(){
      this.$root.dialogLogin = true;
      this.registerModal = false;
    },
    showSearchbox(item,index) {
      this.showsearch = index;
     
      // mixpanel.track(item.title,'click')
    },


    submitForm(){
      this.$refs.loginRuleForm.validate(valid => {
        if (valid) {
          axios({
              method: 'post',
              url: '/api/web/index/login',
              data:this.loginRuleForm
          }).then(
              res=>{
               if(res.data.code==0){
                  window.localStorage.setItem('islogin',true);
                  window.localStorage.setItem('token',res.data.data.token);
                  window.localStorage.setItem('user_type',res.data.data.user_type);
                  window.localStorage.setItem('cilentuid',res.data.data.client_uid)
                
                  this.$root.dialogLogin = false;
                  if(res.data.data.user_type == '0'){
                    axios({
                        method: 'post',
                        url: '/api/web/client/user-info',
                        data: {
                            token:window.localStorage.token,
                        }
                    }).then(
                        des=>{
                          if(des.data.code == 0){
                            this.loginstatus = 'true';
                            this.sunzhengdata = des.data.data;
                            this.$message.success("登录成功！");
                            setCookie('sunzheng',window.localStorage.token);
                            setCookie('sunzhengtype',window.localStorage.user_type);
                            setCookie('wangyiaccid',res.data.data.wang_yi_accid,86400000);
                            setCookie('wangyitoken',res.data.data.wang_yi_token,86400000);
                            setCookie('islogin',true);
                            window.localStorage.setItem('username',des.data.data.user_name);
                            setCookie('userpic',des.data.data.face_url);
                            this.faceUrlIndex=1;
                          }else{
                            this.$message.error(res.data.msg )
                          }
                        }
                    )
                  }else if(res.data.data.user_type == '1'){
                      this.dialogContacts=true;
                  }
                }else{
                  this.$message.error(res.data.msg )
                }
              }
          )
        }else{
          error => {
            this.$message.error('登录失败！请重试！')
          }
        }
      });
  },
  moveToyz(){
    var tempwindow=window.open('_blank');
    tempwindow.location=window.location.protocol+'//'+'yz.zoomoffices.com';
    this.dialogContacts=false;
  },
  moveToUnder(){
    if(getCookie('sunzheng')){
        axios({
            method: 'post',
            url: '/api/web/index/check-token',
            data: {
                token:getCookie('sunzheng'),
            }
        }).then(
            res=>{
                if(res.data.code==0){
                    if(window.localStorage.user_type==0){
                        window.location.href=window.location.protocol+'//'+window.location.hostname+'/user'
                    }else if(window.localStorage.user_type==1){
                        window.location.href=window.location.protocol+'//'+window.location.hostname+'/yz'
                    }
                }else{
                      var storage = window.localStorage;
                      storage.clear()
                      removeCookie('sunzheng');
                      removeCookie('sunzhengtype');
                      removeCookie('wangyiaccid');
                      removeCookie('wangyitoken');
                      setCookie('islogin',false);
                      this.$router.go(0)
                     
                      alert('登录超时，请重新登录')
                     
                     }
            }
        )
    }else{
        var storage = window.localStorage;
        storage.clear()
        removeCookie('sunzheng');
        removeCookie('sunzhengtype');
        removeCookie('wangyiaccid');
        removeCookie('wangyitoken');
        setCookie('islogin',false);
        
        alert('登录超时，请重新登录')
        this.$router.go(0)
    }
  },

  LoginByPhoneCode(loginByCodeForm){
          axios({
              method: 'post',
              url: '/api/web/index/login',
              data:this.loginByCodeForm
              
          }).then(
              res=>{
               if(res.data.code==0){
                  window.localStorage.setItem('islogin',true);
                  window.localStorage.setItem('token',res.data.data.token);
                  window.localStorage.setItem('user_type',res.data.data.user_type);
                  this.$root.dialogLogin = false;
                  if(res.data.data.user_type == '0'){
                    axios({
                        method: 'post',
                        url: '/api/web/client/user-info',
                        data: {
                            token:window.localStorage.token,
                        }
                    }).then(
                        des=>{
                          if(des.data.code == 0){
                            this.loginstatus = 'true';
                            this.sunzhengdata = des.data.data;
                            this.$message.success("登录成功！");
                            setCookie('sunzheng',window.localStorage.token);
                            setCookie('sunzhengtype',window.localStorage.user_type);
                            setCookie('wangyiaccid',res.data.data.wang_yi_accid,86400000);
                            setCookie('wangyitoken',res.data.data.wang_yi_token,86400000);
                            setCookie('islogin',true);
                            window.localStorage.setItem('username',des.data.data.user_name);
                           setCookie('userpic',des.data.data.face_url);
                            this.faceUrlIndex=1;
                          }else{
                            this.$message.error(res.data.msg )
                          }
                        }
                    )
                  }else if(res.data.data.user_type == '1'){
                     this.dialogContacts=true;
                  }
                }else{
                    this.$message({
                      message: res.data.msg,
                      type: 'error'
                    });
                }
                this.showloginCode = false;
              }
          )
	},
	registerForm() {  // 注册表单
	  if (this.registerRuleForm.type == null) {
        this.$message.error("请选择注册类型！");
      }
      if (this.loginByCodeForm.mobile == "") {
        this.$message.error("请输入手机号！");
      }
      if (this.registerRuleForm.code == "") {
        this.$message.error("请输入短信验证码！");
      }
      if (this.registerRuleForm.password == "") {
        this.$message.error("请输入密码！");
	  }
	  if (this.registerRuleForm.new_password == "") {
        this.$message.error("请确认密码！");
      }
      var reqParams = {
        type: this.registerRuleForm.type,
        mobile: this.loginByCodeForm.mobile,
        code: this.registerRuleForm.code,
        prefix: this.prefix,
        password: this.registerRuleForm.password,
        new_password: this.registerRuleForm.new_password,
        invitationCode: this.registerRuleForm.invitationCode
      };
      

      getRegister(reqParams)
        .then(res => {
          if (res.data.code == 0) {
                window.localStorage.setItem('islogin',true);
                window.localStorage.setItem('token',res.data.data.token);
                window.localStorage.setItem('user_type',res.data.data.user_type);
                setCookie('sunzheng',res.data.data.token);
                setCookie('sunzhengtype',res.data.data.user_type);
                setCookie('islogin',true);
                if(res.data.data.user_type == '0'){
                    axios({
                        method: 'post',
                        url: '/api/web/client/user-info',
                        data: {
                            token:res.data.data.token,
                        }
                    }).then(
                        des=>{
                          if(des.data.code == 0){
                            this.loginstatus = 'true';
                            this.sunzhengdata = des.data.data;
                            this.$message.success("登录成功！");
                            
                            window.localStorage.setItem('username',des.data.data.user_name);
                            setCookie('userpic',des.data.data.face_url);
                            this.faceUrlIndex=1;
                            }else{
                            this.$message.error(des.data,msg);
                          }
                        }
                    )
                  }else if(res.data.data.user_type == '1'){
                      this.dialogContacts=true;
                  }

          }else{
             this.$message.error(res.data.msg);
          }
          this.registerModal = false;
        })
        .catch(error => {
        });
    },

    overSteep() {
    if (this.resetRuleForm.password != this.resetRuleForm.new_password) {
      this.$message.error("两次密码不一致！请重新输入");
      return;
		}
		var reqParams = {
			mobile: this.loginByCodeForm.mobile,
			password: this.resetRuleForm.password,
			new_password: this.resetRuleForm.new_password,
		};
		resetPwd(reqParams).then((res)=>{
			if(res.data.code == 0){
        this.$message.success('重置成功！');
        setTimeout(() => {
          this.showfindmodal2 = false;
        }, 1000);
			}else{
        this.$message.error(res.data.msg);
      }
		})
		.catch((error)=>{
			this.$message.error('重置失败!请稍后重试！')
		})
    },
    fetchprefix() {
      getprefixcode()
        .then(res => {
          if (res.data.code == 0) {
            this.options=res.data.data
            // res.data.data.forEach(item => {
            //   this.options.push({ label: item });
            // });
          }else{
            this.$message.error(res.data.msg )
          }
        })
        .catch(error => {
          this.$message.error("查询失败！");
        });
    },

    fetchsmscode(type) {
      // 短信验证码
      var reqParams = {
        prefix: this.prefix,
        mobile: this.loginByCodeForm.mobile,
        type:type,
      };
      getsmscode(reqParams)
        .then(res => {
          if (res.data.code == 0) {
            if (!this.timer) {
              this.count = TIME_COUNT;
              this.show = false;
              this.timer = setInterval(() => {
                if (this.count > 0 && this.count <= TIME_COUNT) {
                  this.count--;
                } else {
                  this.show = true;
                  clearInterval(this.timer); // 清除定时器
                  this.timer = null;
                }
              }, 1000);
            }
          }else{
            this.$message.error(res.data.msg )
          }
        })
        .catch(error => {
          this.$message({
            message: "查询失败,请重试!",
            type: "error"
          });
        });
    },

    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
    foregest() {
      this.$root.dialogLogin = false;
      this.registerModal = false;
      this.showfindmodal2 = false;
      this.showfindmodal1 = true;
    },
    nextSteep() {
      this.$root.dialogLogin = false;
      this.registerModal = false;
      this.showfindmodal1 = false;
      this.showfindmodal2 = true;
      this.shownext = false;
    },
    // 获取验证码
    send(type) {
      
      this.fetchsmscode(type);
    },
    gohome() {
      this.$router.push({ path: "/home/homepage" });
	},
	
	checksmscodebycode(){
      var reqParams = {
        mobile:this.loginByCodeForm.mobile,
        code:this.loginByCodeForm.pwdCode,
      }
      getchecksmscode(reqParams).then((res)=>{
        if(res.data.code == 0){
          this.shownext = true;
        }else{
          this.$message.error(res.data.msg )
        }
      })
      .catch((error)=>{

      })
  },
  
  checksmscode(){
      var reqParams = {
        mobile:this.loginByCodeForm.mobile,
        code:this.loginByCodeForm.pwdCode,
      }
      getchecksmscode(reqParams).then((res)=>{
        if(res.data.code == 0){

        }else{
          this.$message.error(res.data.msg )
        }
      })
      .catch((error)=>{

      })
	},

	checkCode(){
      var reqParams = {
        mobile:this.loginByCodeForm.mobile,
        code: this.registerRuleForm.code,
      }
      getchecksmscode(reqParams).then((res)=>{
        if(res.data.code == 0){

        }else{
          this.$message.error(res.data.msg )
        }
      })
      .catch((error)=>{

      })
	},

	checkpwdCode(){  // 验证忘记密码弹窗短信验证码
      var reqParams = {
        mobile:this.loginByCodeForm.mobile,
        code: this.findRuleForm.code,
      }
      getchecksmscode(reqParams).then((res)=>{
        if(res.data.code == 0){
          this.showfindmodal1 = false;
          this.showfindmodal2 = true;
          this.shownext = false;
        }else{
          this.$message.error(res.data.msg )
        }
      })
      .catch((error)=>{

      })
	},

  logout(){
     axios({
          method: 'post',
          url: '/api/web/index/sign-out',
          data: {
              token:window.localStorage.token,
          }
      }).then(
      
      res=>{
          this.faceUrlIndex=0;
          this.$store.dispatch('logOut');
          this.loginstatus = this.$store.state.islogin;
      }
      )
    
  },

  changePasss(value) {
      this.visible = !(value === 'show');
    },
    Hidepwds(value) {
      this.hidepassword = !(value === 'showpwd');
    },
  },
  mounted() {
  if(getCookie('userpic')){

  }else{
      this.loginstatus="false";
      window.localStorage.removeItem('token');
      removeCookie('sunzheng');
      removeCookie('sunzhengtype');
      removeCookie('wangyiaccid');
      removeCookie('wangyitoken');
      removeCookie('islogin');
  }
  window.addEventListener("wee", this.setIndex, true);
    this.fetchprefix();
  },
  beforeDestory(){
    var storage = window.localStorage;
    storage.clear()
    removeCookie('sunzheng');
    removeCookie('sunzhengtype');
    removeCookie('wangyiaccid');
    removeCookie('wangyitoken');
    removeCookie('islogin');
    removeCookie('userpic');
  },
  computed: {
    radioStyle() {
      return {
        width: "300px",
        marginRight: "20px"
      };
    },
    faceUrl(){
      if(this.faceUrlIndex==1){
        return getCookie('userpic')
      }else if(this.faceUrlIndex==0&&getCookie('userpic')){
         return getCookie('userpic')
      }
      
    },
    ...mapState(['username','userpic','token'])
  },
};


</script>
<style lang="scss" scoped>
.container {
    width:100%;
    height: 61px;
    position: fixed;
    background: rgba(255, 255, 255, 1);
    z-index:1000;
    font-family: 'Arial';
    box-shadow: 0px 7px 18px 0px rgba(99, 96, 96, 0.2);
  .containerbox{
    width:1500px;
    height: 61px;
    margin:0 auto;
  .nav {
    width: 100%;
    height: 61px;
    background: rgba(255, 255, 255, 1);
    position: relative;
    left: 20px;
    .navbox{
      height: 61px;
      .logo_box {
        position: absolute;
        width: 132px;
        height: 43px;
        left: 0px;
        margin: 0px 0px 19px 0px;
        .logo_img {
          height: 33px;
          width: 100px;
          background-image: url('../assets/img/logo.svg');
          overflow: hidden;
          position: absolute;
          left: 45px;
          &:hover {
            cursor: pointer;
          }
        }
        .logo_box_text {
          position: absolute;
          left: 45px;
          top: -15px;
          text-align: left;
          p {
            height: 10px;
          }
        }
      }

      .tell_box {
        width: 167px;
        height: 61px;
        line-height: 30px;
        position: absolute;
        margin: 0px 0px 25px 0px;
        display: flex;
        justify-content: space-around;
        align-items: center;
        left: 400px;
        .phone_number {
          font-size: 16px;
          color: #141414;
        }
        .search_box {
          width: 13vw;
          position: absolute;
          left: -13vw;
        }
      }

      .nav_box {
          width: 700px;
          height: 61px;
          line-height: 30px;
          position: absolute;
          left: 560px;
          .class_list {
            position: relative;
            li {
              display: inline-block;
              float:left;
              margin-left: 50px;
              span{
                cursor: pointer;
              }
              .active {
                padding-bottom: 7px;
                color: #ffdb00;
                text-decoration: none;
                border-bottom: 3px solid #ffdb00;
                cursor: pointer;
              }
            }
            .tag{
              width:112px;
              height:28px;
              line-height: 28px;
              color: #FFFFFF;
              position: absolute;
              z-index:2000;
              top: 30px;
              left: 160px;
              font-size: 12px;
              background:#676767;
            }
          }
        }
        .user_box {
          position: absolute;
          width: 12vw;
          height: 61px;
          line-height: 61px;
          left:1200px;
          display: flex;
          justify-content:flex-start;
          .user_img {
            width: 40px;
            height: 40px;
            position: absolute;
            top: 10px;
            border-radius: 50%;
          }
          .username{
            width: 12vw;
            height: 61px;
            position: absolute;
            left: 0px;
          }
          .login {
            margin-top: 1px;
            &:hover {
              cursor: pointer;
            }
          }
        }

      }
      .actived {
        color: #ffdb00;
      }
    }
    .userHover {
      border: 1px solid #ffe300;
    }
    .loginModal,
    .registerModal {
      padding: 0 65px;
      .loginTit,
      .registerTit {
        font-size: 30px;
        color: rgba(20, 20, 20, 1);
        line-height: 40px;
        text-align: left;
      }
      .registerText {
        color: #ffdb00;
        margin-left: 15px;
        cursor: pointer;
      }
      .loginBtn {
        width: 100%;
        background: rgba(255, 227, 0, 1);
        line-height: 50px;
        font-size: 18px;
        color: rgba(20, 20, 20, 1);
        line-height: 24px;
        letter-spacing: 1px;
        outline: none;
        border: 0;
      }
      .phoneType {
        display: inline-block;
        width: 120px;
        line-height: 50px;
      }
      .phoneNum {
        // display: inline-block;
        width: 374px;
        line-height: 41px;
      }
      .checkLogin {
        span {
          cursor: pointer;
          font-size: 14px;
          color: rgba(102, 102, 102, 1);
          line-height: 19px;
        }
      }
      .category {
        font-size: 14px;
        color: rgba(20, 20, 20, 1);
        cursor: pointer;
        line-height: 40px;
        margin-bottom: 20px;
        .user,
        .owner {
          width: 240px;
          border: 1px solid rgba(234, 234, 234, 1);
        }
      }
      .invitation {
        width: 120px;
        display: inline-block;
        line-height: 40px;
        border-radius: 4px;
        border: 1px solid rgba(234, 234, 234, 1);
      }
    }
    .text-left {
      text-align: left;
    }
    .text-center {
      text-align: center;
    }
    .text-right {
      text-align: right;
    }
  }
}    
</style>